$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'sys/template/list',
        datatype: "json",
        colModel: [
            {label: 'id', name: 'id', width: 30, key: true},
            {label: '相关类型', name: 'type', width: 50,formatter:function (value, options, row) {
                    if(value==1){
                        return "交易相关";
                    }else if(value ==2){
                        return "终端管理";
                    }
                }},
            {label: '模板类型', name: 'inOut', width: 70,formatter:function (value, options, row) {
                    if(value==1){
                        return "导入";
                    }else if(value ==2){
                        return "导出";
                    }
                }},
            {
                label: '地址', name: 'url', width: 150, formatter: function (value, options, row) {
                    return value==null?'无地址':'<a  onclick = "openImg(\''+value+'\')"> 下载模板 </a>';
                }
            },
            {label: '描述', name: 'remark', width: 150},
            {label: '创建时间', name: 'createDate', width: 80},
            {
                label: '渠道', name: 'deptId', width: 80, formatter: function (value, options, row) {
                    let name;
                    $.ajax({
                        async: false,
                        type: "POST",
                        url: baseURL + "sys/dept/info/" + value,
                        dataType: 'json',
                        success: function (r) {
                            name = r.dept.name;
                        }
                    });

                    return name;
                }
            }

        ],
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList: [10, 30, 50],
        rownumbers: true,
        rownumWidth: 25,
        autowidth: true,
        multiselect: false,
        pager: "#jqGridPager",
        jsonReader: {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames: {
            page: "page",
            rows: "limit",
            order: "order"
        },
        gridComplete: function () {
            //隐藏grid底部滚动条
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
        }
    });


    vm.initalDept();
});

var vm = new Vue({
    el: '#rrapp',
    data: {
        q: {
            inOut: 0,
            deptId:0,
            type:0
        },
        inOuts:[
            {
                value:0,
                msg:"请选择"
            },
            {
                value:1,
                msg:"导入"
            },
            {
                value:2,
                msg:"导出"
            }


        ],
        types:[
            {
                value:0,
                msg:"请选择"
            },
            {
                value:1,
                msg:"交易相关"
            },
            {
                value:2,
                msg:"终端相关"
            }


        ],
        depts:[],
        showList:true,
        showAdd:false,
        title:null,
        template:{
            type:0,
            inOut:0,
            deptId:0,
            remark:null,
            url:null
        }
    },
    methods: {
        query: function () {
            vm.reload();
        },
        reload: function (event) {
            vm.showList=true;
            vm.showAdd=false;
            var page = $("#jqGrid").jqGrid('getGridParam', 'page');
            $("#jqGrid").jqGrid('setGridParam', {
                postData: {'deptId': vm.q.deptId,'inOut':vm.q.inOut,'type':vm.q.type},
                page: page
            }).trigger("reloadGrid");
        },
        add: function () {
            vm.showList=false;
            vm.showAdd=true;
            vm.title="添加模板";
        },
        initalDept:function () {
            $.get(baseURL+"sys/dept/childList/3",r=>{
                vm.$set(vm.depts, 0, {
                    deptId: 0,
                    name: "请选择渠道"
                });
                for (var i = 0; i < r.dept.length; i++) {
                    vm.$set(vm.depts, (i+1), r.dept[i]);
                }

            })
        },
        save:function () {
            var formData=new FormData($(".addTemplate")[0]);
            formData.append("file",$("#uploadFile")[0]);
            $.ajax({
                url:baseURL+"sys/template/uploadTemplate",
                datatype:'json',
                type:'post',
                data:formData,
                cache:false,
                traditional: true,
                contentType: false,
                processData: false,
                success:function (msg) {

                    if(msg.url!=null && msg.url!=''){
                        vm.template.url=msg.url;
                        $.ajax({
                            url: baseURL + "sys/template/save",
                            type: "post",
                            contentType: "application/json",
                            data: JSON.stringify(vm.template),
                            success: function (r) {
                                if (r.code == 0) {
                                    alert(r.msg)
                                    vm.reload();
                                } else {
                                    alert(r.msg)
                                }
                            }
                        })


                    }
                }

            })




        }
    }
});


//打开图片
function openImg(src){
    window.location.href=src;
}